<template>
    <button type="button" class="btn btn-sm" :class="labelClass" @click='submit()'>{{text}}</button>
</template>
<script>
    import {GET_STATUS,GET_FAR_STATUS,GET_LAZY_STATUS} from 'serves/data-status'
    export default{
        name:'StatusIfBtn',
        props:{
            pData:{
                type:[String,Number],
                request:true
            },
            pName:{
                type:String,
                request:true
            },
            pKeyText:{
                type:String,
                default:'code'
            },
            pValueText:{
                type:String,
                default:'name'
            },
            pLazy:{
                type:Boolean,
                default:false
            },
            pFar:{
                type:Boolean,
                default:false
            }
        },
        data(){
            return{
                text:'',
                code:'',
                labelClass:''
            }
        },
        created(){
            this.init();
        },
        methods:{
            dataInit(c){
                this.$set(this.$data,'text',c[0]&&c[0][this.pValueText]||'');
                this.$set(this.$data,'code',c[0]&&c[0][this.pKeyText]||'');
                this.$set(this.$data,'labelClass',c[0]&&c[0]['btnClass'].replace('bg-','btn-')||'');
            },
            init(){
                if(this.pFar){
                    let d = GET_FAR_STATUS(this.pName,false,this.pKeyText);
                    if(d.length==2){
                        let c = d.filter(item=>item[this.pKeyText]!=this.pData);
                        this.dataInit(c);
                    }else {
                        //this.$set(this.$data,'text','FarErr:'+this.pName+','+this.pData);
                        this.$set(this.$data,'labelClass','');
                    }
                }else {
                    if(!this.pLazy){
                        let d = GET_STATUS(this.pName,false,this.pKeyText);
                        if(d.length==2) {
                            let c = d.filter(item=>item[this.pKeyText] != this.pData);
                            this.dataInit(c);
                        }else {
                            //this.$set(this.$data,'text','Err:'+this.pName+','+this.pData);
                            this.$set(this.$data,'labelClass','');
                        }

                    }else {
                        GET_LAZY_STATUS(this.pName,false,this.pKeyText).then((res)=>{
                            let d = res;
                            if(d.length==2) {
                                let c = d.filter(item=>item[this.pKeyText] != this.pData);
                                this.dataInit(c);
                            }else {
                                //this.$set(this.$data,'text','lazyErr:'+this.pName+','+this.pData);
                                this.$set(this.$data,'labelClass','');
                            }
                        });
                    }
                }
            },
            submit(){
                this.$emit('on-change',this.code)
            }
        },
        watch:{
            pData(newVal,olVal){
                if(newVal!=olVal){
                    this.init()
                }
            }
        },
        components:{

        }
    }
</script>